<template>
  <el-row class="tac">
    <el-menu
      default-active="1"
      class="el-menu-vertical-demo"
      @open="handleOpen"
      @close="handleClose"
    >
      
      <router-link to="/home/chat" tag="el-menu-item" index="1">
        <i class="el-icon-s-comment"></i>
        <span>消息</span>
      </router-link>
      <el-submenu index="2">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>个人中心</span>
        </template>
        <el-menu-item-group>
          <router-link to="/home/user" tag="el-menu-item" index="1-1">个人信息</router-link>
          <el-menu-item index="1-2">修改信息</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
    </el-menu>
  </el-row>
</template>
<script>
export default {
  name: "leftMenu",
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    }
  }
};
</script>
<style scoped>
.tac {
  width: 100%;
}
</style>

